<template>
	<view class="app-container">
		<cityPicker :column="3" :default-value="defaultValue" :mask-close-able="true" @confirm="confirm"
			@cancel="cancel" :visible="visible" />
		<!-- 导航栏 -->
		<u-navbar title="商户信息" backgroundColor="#007aff" autoBack leftIcon="arrow-left" fixed safeAreaInsetTop />
		<scroll-view scroll-y class="page-wrap">
			<!-- 安全距离块 -->
			<view class="safe-area" :style="{ height: GM_STATUS_BAR_HEIGHT + 120 + 'rpx' }"></view>
			<!-- 商户信息卡片 -->
			<view class="merchant-header">
				<view class="merchant-logo">
					<image :src="logo" mode="scaleToFill"></image>
				</view>
				<view class="merchant-info">
					<view class="merchant-name">
						<text class="font-weight">{{ formBasicInfo.shortName }}</text>
						<text v-if="formBasicInfo.branch" class="u-font-22 u-m-l-10 color-999">({{ formBasicInfo.branch
						}})</text>
					</view>
					<view class="merchant-company">{{ formLicense.companyName }}</view>
					<view class="merchant-contact">管理员账号 {{ formBasicInfo.tel }}</view>
				</view>

			</view>

			<view class="info-body">
				<!-- 折叠面板：4个核心模块 -->
				<u-collapse accordion v-model="activeNames">
					<!-- 1. 企业法人执照书 -->
					<u-collapse-item name="license" class="collapse-item">
						<template #title>
							<view class="card collapse-card collapse-title-card">
								<view class="section-header">
									<text class="section-title">企业法人 营业执照</text>
									<!-- 									<u-tag :text="statusMap[formLicense.auditStatus]?.text || '待审核'"
										:type="statusMap[formLicense.auditStatus]?.type || 'warning'" class="status-tag"
										size="mini" /> -->

									<CustomTag :text="statusMap[formLicense.auditStatus]?.text"
										:bgColor="statusMap[formLicense.auditStatus]?.bgColor"
										:textColor="statusMap[formLicense.auditStatus]?.textColor" />
								</view>
							</view>
						</template>
						<view class="card collapse-card">
							<view class="image-display flex-row-center">
								<!-- 营业执照图片 -->
								<template v-if="isEditingLicense">
									<!-- 编辑模式下可以上传和删除图片 -->
									<u-upload :fileList="formLicense.image ? [formLicense.image] : []"
										class="custom-upload" accept="image" :maxCount="1" :previewFullImage="true"
										:deletable="true" @afterRead="(e) => afterRead(e, 'license')"
										@delete="(e) => onDeleteFile(e, 'license')" />
								</template>

								<template v-else>
									<image v-if="formLicense.image" :src="formLicense.image.url" mode="aspectFit"
										class="permit-image" />
									<view v-else class="no-wds-image">
										<u-icon name="camera-fill" size="26" color="#D3D4D6"></u-icon>
									</view>
								</template>

								<!-- 				<template v-else-if="formLicense.image">
									<image :src="formLicense.image.url" mode="aspectFit" class="permit-image" />
								</template> -->

								<!-- 								<view class="info-update" @click="isEditingLicense = true" v-if="!isEditingLicense">更新
								</view> -->
							</view>

							<view class="form-container">
								<view class="form-item">
									<view class="label">企业名称</view>
									<view class="form-inp"
										:style="{ 'background-color': isEditingLicense ? '#f5f5f5' : '#fff' }">
										<input type="text" v-model="formLicense.companyName" placeholder="请输入营业执照名称"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingLicense" />
									</view>
								</view>

								<view class="form-item">
									<text class="label">统一代码</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingLicense ? '#f5f5f5' : '#fff' }">
										<input type="text" v-model="formLicense.uscc" placeholder="请输入统一社会信用代码"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingLicense" />
									</view>
								</view>

								<view class="form-item">
									<text class="label">法定代表人</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingLicense ? '#f5f5f5' : '#fff' }">
										<input type="text" v-model="formLicense.legalPerson" placeholder="请输入法定代表人姓名"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingLicense" />
									</view>
								</view>
							</view>

							<!-- 操作按钮 -->
							<view class="action-buttons">

								<view v-if="!isEditingLicense" class="action-buttons-update"
									@tap="isEditingLicense = true">
									修改信息
								</view>

								<view v-if="isEditingLicense" class="action-buttons-submit" @tap="saveLicense">
									保存并提交审核
								</view>

								<!-- 								<u-button type="success" @tap="saveLicense" size="mini" v-if="isEditingLicense"
									:disabled="!formLicense.companyName || !formLicense.uscc || !formLicense.legalPerson">保存并提交审核</u-button> -->
							</view>
						</view>
					</u-collapse-item>

					<!-- 2. 管理员授权书 -->
					<u-collapse-item name="authorization" class="collapse-item">
						<template #title>
							<view class="card collapse-card collapse-title-card">
								<view class="section-header">
									<text class="section-title">管理员授权书</text>
									<!-- 									<u-tag :text="statusMap[formAuthorization.auditStatus]?.text || '待审核'"
										:type="statusMap[formAuthorization.auditStatus]?.type || 'warning'"
										class="status-tag" size="mini" /> -->

									<CustomTag :text="statusMap[formAuthorization.auditStatus]?.text"
										:bgColor="statusMap[formAuthorization.auditStatus]?.bgColor"
										:textColor="statusMap[formAuthorization.auditStatus]?.textColor" />
								</view>
							</view>
						</template>
						<view class="card collapse-card">
							<view class="image-display flex-row-center">
								<!-- 授权书图片 -->
								<template v-if="isEditingAuthorization">
									<!-- 编辑模式下可以上传和删除图片 -->
									<u-upload :fileList="formAuthorization.image ? [formAuthorization.image] : []"
										class="custom-upload" accept="image" :maxCount="1" :previewFullImage="true"
										:deletable="true" @afterRead="(e) => afterRead(e, 'authorization')"
										@delete="(e) => onDeleteFile(e, 'authorization')" />
								</template>

								<template v-else>
									<image v-if="formAuthorization.image" :src="formAuthorization.image.url"
										mode="aspectFit" class="permit-image" />
									<view v-else class="no-wds-image">
										<u-icon name="camera-fill" size="26" color="#D3D4D6"></u-icon>
									</view>
								</template>


								<!-- 								<template v-else-if="formAuthorization.image">
									<image :src="formAuthorization.image.url" mode="aspectFit" class="permit-image" />
								</template> -->
								<!-- 
								<view class="info-update" @click="isEditingAuthorization = true"
									v-if="!isEditingAuthorization">更新
								</view> -->
							</view>
							<view class="form-container">
								<view class="form-item">
									<text class="label">授权单位</text>
									<view class="form-inp2">
										<input type="text" v-model="formLicense.companyName" disabled />
									</view>
								</view>

								<!-- 被授权人 -->
								<view class="form-item">
									<text class="label">被授权人</text>
									<view v-if="isEditingAuthorization" class="form-inp"
										style="background-color: #f5f5f5">
										<input type="text" v-model="formAuthorization.authorizedPerson"
											placeholder="请输入被授权人姓名"
											placeholder-style="color:#a0a0a0;font-weight:normal;" />
									</view>
									<view v-else class="form-inp" style="background-color: #fff">
										<text :class="{ 'placeholder-text': !formAuthorization.authorizedPerson }">
											{{ formAuthorization.authorizedPerson || '请输入被授权人姓名' }}
										</text>
									</view>
								</view>

								<!-- 身份证号 -->
								<view class="form-item">
									<text class="label">身份证号</text>
									<view v-if="isEditingAuthorization" class="form-inp"
										style="background-color: #f5f5f5">
										<input type="text" v-model="formAuthorization.idCard" placeholder="请输入被授权人身份证号"
											placeholder-style="color:#a0a0a0;font-weight:normal;" />
									</view>
									<view v-else class="form-inp" style="background-color: #fff">
										<text :class="{ 'placeholder-text': !formAuthorization.idCard }">
											{{ maskIdCard(formAuthorization.idCard) || '请输入被授权人身份证号' }}
										</text>
									</view>
								</view>

								<!-- 手机号码 -->
								<view class="form-item">
									<text class="label">手机号码</text>
									<view v-if="isEditingAuthorization" class="form-inp"
										style="background-color: #f5f5f5">
										<input type="number" v-model="formAuthorization.tel" placeholder="请输入被授权人手机号"
											placeholder-style="color:#a0a0a0;font-weight:normal;" />
									</view>
									<view v-else class="form-inp" style="background-color: #fff">
										<text :class="{ 'placeholder-text': !formAuthorization.tel }">
											{{ maskPhone(formAuthorization.tel) || '请输入被授权人手机号' }}
										</text>
									</view>
								</view>
							</view>


							<!-- 操作按钮 -->
							<view class="action-buttons">
								<view v-if="!isEditingAuthorization" class="action-buttons-update"
									@tap="isEditingAuthorization = true">
									修改信息
								</view>

								<view v-if="isEditingAuthorization" class="action-buttons-submit"
									@tap="saveAuthorization">
									保存并提交审核
								</view>

								<!-- 								<u-button type="success" @tap="saveAuthorization" size="mini"
									v-if="isEditingAuthorization"
									:disabled="!formAuthorization.companyName || !formAuthorization.authorizedPerson || !formAuthorization.idCard || !formAuthorization.tel">保存并提交审核</u-button> -->
							</view>
						</view>
					</u-collapse-item>

					<!-- 3. 旅行社许可证 -->
					<u-collapse-item name="permit" class="collapse-item" v-if="merchantInfo.businessType == 2">
						<template #title>
							<view class="card collapse-card collapse-title-card">
								<view class="section-header">
									<text class="section-title">旅行社业务经营许可证</text>
									<!-- 									<u-tag :text="statusMap[formPermit.auditStatus]?.text || '待审核'"
										:type="statusMap[formPermit.auditStatus]?.type || 'warning'" class="status-tag"
										size="mini" /> -->

									<CustomTag :text="statusMap[formPermit.auditStatus]?.text"
										:bgColor="statusMap[formPermit.auditStatus]?.bgColor"
										:textColor="statusMap[formPermit.auditStatus]?.textColor" />
								</view>
							</view>
						</template>
						<view class="card collapse-card">
							<view class="image-display flex-row-center">
								<!-- 许可证图片 -->
								<!-- 								<template v-if="isEditingTravelAgency">
									<u-upload :fileList="formPermit.image ? [formPermit.image] : []"
										 accept="image" :maxCount="1" :previewFullImage="true"
										:deletable="true" @afterRead="(e) => afterRead(e, 'permit')"
										@delete="(e) => onDeleteFile(e, 'permit')" />
								</template>

								<template v-else-if="formPermit.image">
		
									<image :src="formPermit.image.url" mode="aspectFit" class="permit-image" />
								</template> -->

								<template v-if="isEditingTravelAgency">
									<u-upload :fileList="formPermit.image ? [formPermit.image] : []" :maxCount="1"
										accept="image" :previewFullImage="true" :deletable="true"
										@afterRead="(e) => universalUpload(e, 'permit')"
										@delete="(e) => deleteFile(e, 'permit')" />
								</template>

								<template v-else>
									<image v-if="formPermit.image" :src="formPermit.image.url" mode="aspectFit"
										class="permit-image" />
									<view v-else class="no-wds-image">
										<u-icon name="camera-fill" size="26" color="#D3D4D6"></u-icon>
									</view>
								</template>

								<!-- 								<view class="info-update" @click="isEditingTravelAgency = true"
									v-if="!isEditingTravelAgency">更新
								</view> -->
							</view>
							<view class="form-container">
								<view class="form-item">
									<text class="label">旅行社名称</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingTravelAgency ? '#f5f5f5' : '#fff' }">
										<input
											:style="{ 'background-color': isEditingTravelAgency ? '#f5f5f5' : '#fff' }"
											type="text" v-model="formPermit.name" placeholder="请输入旅行社名称"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingTravelAgency" />
									</view>
								</view>


								<view class="form-item">
									<text class="label">旅行社编号</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingTravelAgency ? '#f5f5f5' : '#fff' }">
										<input type="text"
											:style="{ 'background-color': isEditingTravelAgency ? '#f5f5f5' : '#fff' }"
											v-model="formPermit.agencyNo" placeholder="请输入旅行社编号"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingTravelAgency" />
									</view>
								</view>

								<view class="form-item">
									<text class="label">许可经营业务</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingTravelAgency ? '#f5f5f5' : '#fff' }">
										<u-textarea
											:style="{ 'background-color': isEditingTravelAgency ? '#f5f5f5' : '#fff' }"
											v-model="formPermit.scope" placeholder="请输入许可经营业务"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingTravelAgency" />
									</view>
								</view>
							</view>

							<!-- 操作按钮 -->
							<view class="action-buttons">
								<view v-if="!isEditingTravelAgency" class="action-buttons-update"
									@tap="isEditingTravelAgency = true">
									修改信息
								</view>
								<view v-if="isEditingTravelAgency" class="action-buttons-submit"
									@tap="saveTravelAgency">
									保存并提交审核
								</view>
								<!-- 								<u-button type="success" @tap="saveTravelAgency" size="mini"
									v-if="isEditingTravelAgency"
									:disabled="!formPermit.agencyNo || !formPermit.scope">保存并提交审核</u-button> -->
							</view>
						</view>
					</u-collapse-item>


					<!-- 3. 旅行社责任险 -->
					<!-- <u-collapse-item name="permit" class="collapse-item" v-if="merchantInfo.businessType == 2">
						<template #title>
							<view class="card collapse-card collapse-title-card">
								<view class="section-header">
									<text class="section-title">旅行社责任险</text>

									<CustomTag :text="statusMap[formPermit.auditStatus]?.text"
										:bgColor="statusMap[formPermit.auditStatus]?.bgColor"
										:textColor="statusMap[formPermit.auditStatus]?.textColor" />
								</view>
							</view>
						</template>
						<view class="card collapse-card">
							<view class="image-display flex-row-center">
								
								<template v-if="isEditingTravelAgency">
								
									<u-upload :fileList="formPermit.image ? [formPermit.image] : []"
										class="custom-upload" accept="image" :maxCount="1" :previewFullImage="true"
										:deletable="true" @afterRead="(e) => afterRead(e, 'permit')"
										@delete="(e) => onDeleteFile(e, 'permit')" />
								</template>

								<template v-else>
									<image v-if="formPermit.image" :src="formPermit.image.url" mode="aspectFit"
										class="permit-image" />
									<view v-else class="no-wds-image">
										<u-icon name="camera-fill" size="26" color="#D3D4D6"></u-icon>
									</view>
								</template>
							</view>

							<view class="form-container">
								<view class="form-item">
									<text class="label">旅行社编号</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingTravelAgency ? '#f5f5f5' : '#fff' }">
										<input
											:style="{ 'background-color': isEditingTravelAgency ? '#f5f5f5' : '#fff' }"
											type="text" v-model="formPermit.agencyNo" placeholder="请输入旅行社编号"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingTravelAgency" />
									</view>
								</view>

								<view class="form-item">
									<text class="label">许可经营业务</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingTravelAgency ? '#f5f5f5' : '#fff' }">
										<u-textarea
											:style="{ 'background-color': isEditingTravelAgency ? '#f5f5f5' : '#fff' }"
											v-model="formPermit.scope" placeholder="请输入许可经营业务"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingTravelAgency" />
									</view>
								</view>
							</view>

						
							<view class="action-buttons">
								<view v-if="!isEditingTravelAgency" class="action-buttons-update"
									@tap="isEditingTravelAgency = true">
									修改信息
								</view>
								<view v-if="isEditingTravelAgency" class="action-buttons-submit"
									@tap="saveTravelAgency">
									保存并提交审核
								</view>
							</view>
						</view>
					</u-collapse-item> -->

					<!-- 4. 商家详细信息 -->
					<u-collapse-item name="basic" class="collapse-item">
						<template #title>
							<view class="card collapse-card collapse-title-card">
								<view class="section-header">
									<text class="section-title">商家基本信息</text>
									<!-- 									<u-tag :text="statusMap[formBasicInfo.auditStatus]?.text || '审核通过'"
										:type="statusMap[formBasicInfo.auditStatus]?.type || 'success'"
										class="status-tag" size="mini" /> -->

									<CustomTag :text="statusMap[formBasicInfo.auditStatus]?.text"
										:bgColor="statusMap[formBasicInfo.auditStatus]?.bgColor"
										:textColor="statusMap[formBasicInfo.auditStatus]?.textColor" />
								</view>
							</view>
						</template>
						<view class="card collapse-card">
							<view class="image-display flex-row-center">
								<!-- 								<view class="info-update" @click="isEditingMerchantItem = true"
									v-if="!isEditingMerchantItem">更新
								</view> -->
							</view>

							<view class="form-container">
								<view class="form-item">
									<text class="label">所在城市</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingMerchantItem ? '#f5f5f5' : '#fff' }">
										<input type="text" v-model="formBasicInfo.city" placeholder="请选择所在城市"
											placeholder-style="color:#a0a0a0;font-weight:normal;" :disabled="true"
											@tap="visible = true" />
									</view>
								</view>

								<view class="form-item">
									<text class="label">商家简称</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingMerchantItem ? '#f5f5f5' : '#fff' }">
										<input type="text" v-model="formBasicInfo.shortName" placeholder="请输入商家简称"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingMerchantItem" />
									</view>
								</view>

								<view class="form-item">
									<text class="label">分店名称</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingMerchantItem ? '#f5f5f5' : '#fff' }">
										<input type="text" v-model="formBasicInfo.branch" placeholder="请输入分店名称"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingMerchantItem" />
									</view>
								</view>

								<view class="form-item">
									<text class="label">商家电话</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingMerchantItem ? '#f5f5f5' : '#fff' }">
										<input type="number" v-model="formBasicInfo.tel" placeholder="请输入商家电话"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingMerchantItem" />
									</view>
								</view>

								<view class="form-item">
									<text class="label">投诉电话</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingMerchantItem ? '#f5f5f5' : '#fff' }">
										<input type="number" v-model="formBasicInfo.complainTel" placeholder="请输入投诉电话"
											placeholder-style="color:#a0a0a0;font-weight:normal;"
											:disabled="!isEditingMerchantItem" />
									</view>
								</view>

								<view class="form-item">
									<text class="label">详细地址</text>
									<view class="form-inp"
										:style="{ 'background-color': isEditingMerchantItem ? '#f5f5f5' : '#fff' }">

										<input type="number" v-model="formBasicInfo.address" placeholder="请输入详细地址"
											placeholder-style="color:#a0a0a0;font-weight:normal;" :disabled="true"
											@tap="chooseLocation" />
									</view>
								</view>
							</view>
							<!-- 操作按钮 -->
							<view class="action-buttons">
								<view v-if="!isEditingMerchantItem" class="action-buttons-update"
									@tap="isEditingMerchantItem = true">
									修改信息
								</view>
								<view v-if="isEditingMerchantItem" class="action-buttons-submit"
									@tap="saveMerchantItem">
									保存并提交审核
								</view>

								<!-- <u-button type="success" @tap="saveMerchantItem" size="mini"
									v-if="isEditingMerchantItem"
									:disabled="!formBasicInfo.city || !formBasicInfo.shortName || !formBasicInfo.branch || !formBasicInfo.tel || !formBasicInfo.complainTel || !formBasicInfo.address">保存并提交审核</u-button> -->
							</view>
						</view>
					</u-collapse-item>

					<!-- 5.商家图册 商家标识 / LOGO -->
					<u-collapse-item name="permit" class="collapse-item">
						<template #title>
							<view class="card collapse-card collapse-title-card">
								<view class="section-header">
									<text class="section-title">商家图册</text>
									<!-- 									<u-tag :text="statusMap[formPermit.auditStatus]?.text || '待审核'"
										:type="statusMap[formPermit.auditStatus]?.type || 'warning'" class="status-tag"
										size="mini" /> -->

									<CustomTag :text="statusMap[formPermit.auditStatus]?.text"
										:bgColor="statusMap[formPermit.auditStatus]?.bgColor"
										:textColor="statusMap[formPermit.auditStatus]?.textColor" />
								</view>
							</view>
						</template>
						<view class="card collapse-card">
							<!-- Logo 上传 -->
							<view class="upload-section">
								<view class="upload-header">
									<view class="upload-title">门店标识/LOGO/商标</view>
									<view class="upload-p" @click="previewMedia(1, slt, 'slt')">查看示例图</view>
								</view>
								<view class="">
									<view class="upload-desc">限上传正反色各2张</view>
									<view class="upload-desc">用于提高产品/服务输出的识别度</view>
								</view>


								<view v-if="formAlbum.logoUrls.length > 0" class="wd-image-list">
									<view v-for="(item, idx) in formAlbum.logoUrls" :key="idx" class="image-item"
										@click="previewMedia(idx, 'logoUrls')">
										<image :src="item.url" mode="aspectFit" class="wd-image" />
										<view class="delete-button" @click.stop="removeImage(idx, 'logoUrls')">
											<u-icon name="close" size="15" color="#888"></u-icon>
										</view>
									</view>

									<view v-if="formAlbum.logoUrls.length < 2" class="add-wd-image"
										@click="chooseImage(2, 'logoUrls')">
										<u-icon name="camera-fill" size="50" color="#888"></u-icon>
									</view>
								</view>

								<view v-else class="no-wd-image" @click="chooseImage(2, 'logoUrls')">
									<u-icon name="camera-fill" size="50" color="#888"></u-icon>
								</view>
							</view>

							<!-- 门头照片上传 -->
							<view class="upload-section">
								<view class="upload-header">
									<view class="upload-title">门头照片</view>
									<view class="upload-p" @click="previewMedia(1, slt, 'slt')">查看示例图</view>
								</view>
								<view class="">
									<view class="upload-desc">优质的门头照片，更能吸引顾客加入</view>
								</view>

								<view v-if="formAlbum.outsideUrls.length > 0" class="wd-image-list">
									<view v-for="(item, idx) in formAlbum.outsideUrls" :key="idx" class="image-item"
										@click="previewMedia(idx, 'outsideUrls')">
										<image :src="item.url" mode="aspectFit" class="permit-image" />
										<view class="delete-button" @click.stop="removeImage(idx, 'outsideUrls')">
											<u-icon name="close" size="15" color="#888"></u-icon>
										</view>
									</view>

									<view v-if="formAlbum.outsideUrls.length < 1" class="add-wd-image"
										@click="chooseImage(1, 'outsideUrls')">
										<u-icon name="camera-fill" size="50" color="#888"></u-icon>
									</view>
								</view>

								<view v-else class="no-wd-image" @click="chooseImage(1, 'outsideUrls')">
									<u-icon name="camera-fill" size="50" color="#888"></u-icon>
								</view>
							</view>

							<!-- 门店内景上传 -->
							<view class="upload-section">
								<view class="upload-header">
									<view class="upload-title">门店内景</view>
									<view class="upload-p" @click="previewMedia(1, slt, 'slt')">查看示例图</view>
								</view>
								<view class="">
									<view class="upload-desc">最多上传6张</view>
									<view class="upload-desc">优质的门店内景，更能吸引顾客加入</view>
								</view>



								<view v-if="formAlbum.insideUrls.length > 0" class="wd-image-list">
									<view v-for="(item, idx) in formAlbum.insideUrls" :key="idx" class="image-item"
										@click="previewMedia(idx, 'insideUrls')">
										<image :src="item.url" mode="aspectFit" class="permit-image" />
										<view class="delete-button" @click.stop="removeImage(idx, 'insideUrls')">
											<u-icon name="close" size="15" color="#888"></u-icon>
										</view>
									</view>

									<view v-if="formAlbum.insideUrls.length < 6" class="add-wd-image"
										@click="chooseImage(6, 'insideUrls')">
										<u-icon name="camera-fill" size="50" color="#888"></u-icon>
									</view>
								</view>

								<view v-else class="no-wd-image" @click="chooseImage(6, 'insideUrls')">
									<u-icon name="camera-fill" size="50" color="#888"></u-icon>
								</view>
							</view>

							<!-- 宣传图册上传 -->
							<view class="upload-section">
								<view class="upload-header">
									<view class="upload-title">宣传相册</view>
									<view class="upload-p" @click="previewMedia(1, slt, 'slt')">查看示例图</view>
								</view>
								<view class="">
									<view class="upload-desc">最多上传6张</view>
									<view class="upload-desc">管理宣传相册，优质图片能有效吸引顾客</view>
								</view>

								<view v-if="formAlbum.promoteUrls.length > 0" class="wd-image-list">
									<view v-for="(item, idx) in formAlbum.promoteUrls" :key="idx" class="image-item"
										@click="previewMedia(idx, 'promoteUrls')">
										<image :src="item.url" mode="aspectFit" class="permit-image" />
										<view class="delete-button" @click.stop="removeImage(idx, 'promoteUrls')">
											<u-icon name="close" size="15" color="#888"></u-icon>
										</view>
									</view>

									<view v-if="formAlbum.promoteUrls.length < 6" class="add-wd-image"
										@click="chooseImage(6, 'promoteUrls')">
										<u-icon name="camera-fill" size="50" color="#888"></u-icon>
									</view>
								</view>

								<view v-else class="no-wd-image" @click="chooseImage(6, 'promoteUrls')">
									<u-icon name="camera-fill" size="50" color="#888"></u-icon>
								</view>
							</view>

							<!-- 门店短视频上传 -->
							<view class="upload-section">
								<view class="upload-header">
									<view class="upload-title">门店短视频</view>
									<view class="upload-p" @click="previewMedia(1, slt, 'slt')">查看示例图</view>
								</view>
								<view class="">
									<view class="upload-desc">优质的视频，更能彰显门店形象</view>
								</view>

								<view v-if="formAlbum.videoUrl.length > 0" class="wd-image-list">
									<view v-for="(item, idx) in formAlbum.videoUrl" :key="idx" class="image-item">
										<video :src="item.url" controls class="permit-video"></video>
										<view class="delete-button" @click.stop="removeImage(idx, 'videoUrl')">
											<u-icon name="close" size="15" color="#888"></u-icon>
										</view>
									</view>

									<view v-if="formAlbum.videoUrl.length < 1" class="add-wd-image"
										@click="chooseVideo('videoUrl')">
										<u-icon name="camera-fill" size="50" color="#888"></u-icon>
									</view>
								</view>

								<view v-else class="no-wd-image" @click="chooseVideo('videoUrl')">
									<u-icon name="camera-fill" size="50" color="#888"></u-icon>
								</view>
							</view>

							<!-- 操作按钮 -->
							<view class="action-buttons">
								<view v-if="isEditingAlbum" class="action-buttons-update" @tap="submitAlbumForm">
									修改信息
								</view>
								<view v-else class="action-buttons-add" @tap="submitAlbumForm">
									信息不全，立即完善
								</view>
								<!-- <u-button type="success" @tap="submitAlbumForm" size="mini">保存并提交审核</u-button> -->
							</view>
						</view>
					</u-collapse-item>


					<u-collapse-item name="permit" class="collapse-item" v-if="otherCertificationList.length > 0"
						v-for="(item, idx) in otherCertificationList">
						<template #title>
							<view class="card collapse-card collapse-title-card">
								<view class="section-header">
									<text class="section-title">{{ item.name }}</text>
									<!-- 							<u-tag :text="statusMap[formPermit.auditStatus]?.text || '待审核'"
										:type="statusMap[formPermit.auditStatus]?.type || 'warning'" class="status-tag"
										size="mini" /> -->
								</view>
							</view>
						</template>

						<view class="card collapse-card">
							<view class="certification-img-box">
								<image class="certification-img" :src="item.imageUrl" mode="aspectFit"
									@tap.stop="previewImage(item.imageUrl)" />
							</view>
						</view>
					</u-collapse-item>

				</u-collapse>

				<view class="other-certification-btn" @tap="navToOtherCertification">
					<image src="/static/icons/add.png" class="other-certification-btn-icon"></image>
					<view class="other-certification-btn-text">
						添加编辑其它证照/资质证明
					</view>
				</view>
			</view>

		</scroll-view>
	</view>
</template>

<script>
import cityPicker from '@/uni_modules/piaoyi-cityPicker/components/piaoyi-cityPicker/piaoyi-cityPicker'
import CustomTag from '@/components/CustomTag.vue'
import {
	request,
	BASE_URL
} from '@/utils/request.js'; // 导入项目封装的请求方法
export default {
	components: {
		cityPicker,
		CustomTag
	},
	data() {
		return {
			GM_STATUS_BAR_HEIGHT: uni.getSystemInfoSync().statusBarHeight,
			activeNames: [], // 折叠面板激活项
			statusMap: {
				0: {
					text: '待审核',
					type: 'warning',
					bgColor: '#F37B1D1A',
					textColor: '#F37B1D'
				},
				1: {
					text: '审核通过',
					type: 'success',
					bgColor: '#3FBDA31A',
					textColor: '#3FBDA3'
				},
				2: {
					text: '已拒绝',
					type: 'error',
					bgColor: '',
					textColor: ''
				},
				3: {
					text: '待完善',
					type: 'info',
					bgColor: '',
					textColor: ''
				},
			},
			// 编辑模式标志
			isAdd: false,
			isEditingTravelAgency: false,
			isEditingMerchantItem: false,
			isEditingAlbum: false,
			isEditingLicense: false,
			isAddingLicense: false, // 新增营业执照标志
			isEditingAuthorization: false, // 编辑授权书标志
			isAddingAuthorization: false, // 新增授权书标志
			// 是否是初始状态（没有商家基本信息）
			isInitialMerchantState: false,
			// API基础URL
			BASE_URL: BASE_URL,
			// 营业执照（接口1）
			formLicense: {
				image: null, // 营业执照图片（单个）
				uscc: '', // 统一社会信用代码 → 接口licenseNo
				companyName: '', // 企业名称
				legalPerson: '', // 法定代表人 → 接口authPerson
				auditStatus: 'audit',
			},
			// 超级管理员授权书（接口1）
			formAuthorization: {
				image: null, // 授权书图片（单个）
				authorizedPerson: '', // 被授权人 → 接口authPerson
				auditStatus: 'audit',
				companyName: '', // 授权单位
				idCard: '', // 身份证号
				tel: '', // 手机号码
			},
			// 经营许可证（接口3）
			formPermit: {
				id: '',
				image: null, // 许可证图片（单个）
				name: '',
				agencyNo: '', // 旅行社编号 → 接口travel_agency_id
				scope: '', // 许可经营业务 → 接口business数组拼接
				auditStatus: 'audit',
			},
			// 商家基本信息（接口2）
			formBasicInfo: {
				id: '',
				city: '', // 所在城市 → 接口city
				shortName: '', // 商家简称 → 接口shopName
				branch: '', // 分店名称 → 接口branchName
				tel: '', // 商家电话 → 接口phone
				complainTel: '', // 投诉电话 → 接口complaintPhone
				address: '', // 详细地址 → 接口address
				latitude: '',
				longitude: '',
				auditStatus: 'audit',
			},
			formAlbum: {
				id: '',
				logoUrls: [],
				promoteUrls: [],
				outsideUrls: [],
				insideUrls: [],
				videoUrl: ''
			},
			otherCertificationList: [],
			merchantInfo: {
				logo: '',
				name: '', // 企业名称 → 接口name
			},

			visible: false,
			defaultValue: '420103',
			initColor: '',
			tagText: '',
			logo: ''
		};
	},
	onLoad() {
		try {
			uni.getStorage({
				key: 'companyInfo',
				success: (res) => {
					if (res && res.data) {
						this.merchantInfo = res.data;
						console.log('merchantInfo', this.merchantInfo)
						// 使用 nextTick 确保数据更新后再执行
						this.$nextTick(() => {
							this.setInitColor()
							this.fetchLicenseAuth(); // 获取营业执照+授权书
							this.fetchTravelPermit(); // 获取经营许可证

							this.fetchBasicInfo(); // 获取商家基本信息
							this.fetchAlbumInfo() //获取商家图像信息
							this.getotherCertification() //获取其他证书信息
						});
					} else {
						console.warn('商家信息为空');
					}
				},
				fail: (err) => {
					console.error('获取商家信息失败:', err);
				}
			});
		} catch (error) {
			console.error('页面初始化错误:', error);
		}


	},
	methods: {
		maskIdCard(idCard) {
			if (!idCard) return '';
			const str = idCard.toString().trim();
			if (str.length <= 8) return str;
			return str.replace(/^(.{4}).+(.{4})$/, '$1****$2');
		},

		// 手机号脱敏：保留前3后4
		maskPhone(phone) {
			if (!phone) return '';
			const str = phone.toString().trim();
			if (str.length <= 7) return str;
			return str.replace(/^(.{3}).+(.{4})$/, '$1****$2');
		},
		chooseImage(count, category) {
			const maxCount = count;
			const currentCount = this.formAlbum[category].length;

			if (currentCount >= maxCount) {
				uni.showToast({
					title: `最多上传${maxCount}张图片`,
					icon: 'none'
				});
				return;
			}

			uni.chooseImage({
				count: 1,
				mediaType: ['image'],
				sourceType: ['album', 'camera'],
				success: async (res) => {
					const tempFilePath = res.tempFilePaths[0];
					const uploadRes = await this.uploadToServer(tempFilePath);
					if (uploadRes.code === 200) {
						const p = {
							url: uploadRes.data.url
						}
						this.formAlbum[category].push(p);
					} else {
						throw new Error(uploadRes.msg || '上传失败');
					}
				}
			});
		},

		uploadToServer(file) {
			return new Promise((resolve, reject) => {
				uni.uploadFile({
					url: `${BASE_URL}/local-file/upload`,
					filePath: file,
					name: 'file',
					header: {
						'Authorization': uni.getStorageSync('accessToken') || ''
					},
					success: (uploadRes) => {
						try {
							const resData = JSON.parse(uploadRes.data);
							if (resData.code === 200) {
								resolve(resData);
							} else {
								reject(new Error(resData.msg || '上传失败'));
							}
						} catch (parseError) {
							reject(new Error('响应解析失败'));
						}
					},
					fail: (err) => {
						reject(err);
					}
				});
			});
		},

		previewMedia(index, field, slt) {
			let u = ''
			if (slt) {
				u = ['https://abc.qctrips.cn/local-file/download?objectName=500be520-977c-4631-ace5-40d2351af9dd.jpg']
			} else {
				u = this.formAlbum[field].map(item => {
					return item.url;
				});
			}

			uni.previewImage({
				urls: u,
				current: index,
				fail: () => {
					uni.showToast({
						title: '无法预览该图片',
						icon: 'none'
					});
				}
			});
		},
		removeImage(index, category) {
			this.formAlbum[category].splice(index, 1);
		},
		chooseVideo(category) {
			uni.chooseVideo({
				sourceType: ['album', 'camera'],
				success: (res) => {
					console.log(res)
				}
			});
		},
		setInitColor() {
			console.log('商家类型:', this.merchantInfo.businessType)
			if (this.merchantInfo.businessType == 1) {
				this.initColor = '#0081FF'
				this.tagText = '泛营地'
			} else if (this.merchantInfo.businessType == 2) {
				this.initColor = '#38B03F'
				this.tagText = '旅行社'
			} else if (this.merchantInfo.businessType == 3) {
				this.initColor = '#F37B1D'
				this.tagText = '学校/校外'
			}
			console.log('颜色:', this.initColor)
		},
		confirm(val) {
			console.log(val)
			this.formBasicInfo.city = val.name
			this.visible = false
		},
		cancel() {
			this.visible = false
		},

		chooseLocation() {
			uni.chooseLocation({
				success: (res) => {
					console.log(res)
					this.formBasicInfo.address = res.address
					this.formBasicInfo.latitude = res.latitude
					this.formBasicInfo.longitude = res.longitude
				},
				fail: () => {
					uni.showToast({
						title: '选择失败',
						icon: 'none'
					});
				}
			});
		},
		previewImage(url) {
			if (!url) return;

			uni.previewImage({
				urls: [url],
				current: 0,
				fail: () => {
					uni.showToast({
						title: '无法预览该图片',
						icon: 'none'
					});
				}
			});
		},
		/**
		 * 通用上传方法（支持 logoUrls / promoteUrls）
		 */
		async universalUpload(event, type) {
			const files = Array.isArray(event.file) ? event.file : [event.file];

			uni.showLoading({
				title: '上传中...',
				mask: true
			});

			try {
				// 使用 Promise.all 并行上传所有文件
				const uploadPromises = files.map(file => this.uploadSingleFileToServer(file));
				const results = await Promise.all(uploadPromises);

				const successfulFiles = results
					.filter(res => res.code === 200)
					.map(res => {
						const processedUrl = this.processImageForMiniProgram(res.data.url);
						return {
							url: processedUrl,
							title: res.data.originalName,
							description: '',
							sort: 1
							// thumb: processedUrl,
							// name: res.data.originalName,
							// size: res.data.size,
							// objectName: res.data.objectName,
							// status: 'success',
							// isImage: true,
							// type: 'image',
							// originalUrl: res.data.url,
							// originalObjectName: res.data.objectName
						};
					});

				// 追加到对应列表
				this.formAlbum[type].push(...successfulFiles);

				uni.showToast({
					title: `${successfulFiles.length}/${files.length} 上传成功`,
					icon: 'success'
				});

			} catch (error) {
				console.error('批量上传失败:', error);
				uni.showToast({
					title: '上传失败',
					icon: 'none'
				});
			} finally {
				uni.hideLoading();
			}
		},

		/**
		 * 删除上传的文件
		 */
		deleteFile(event, type) {
			const index = event.index;
			this.formAlbum[type].splice(index, 1);
		},

		/**
		 * 单文件上传到服务器（核心方法）
		 */
		uploadSingleFileToServer(file) {
			return new Promise((resolve, reject) => {
				let filePath = file.path || file.url;
				if (!filePath) {
					reject(new Error('文件路径无效'));
					return;
				}

				uni.uploadFile({
					url: `${this.BASE_URL}/local-file/upload`, // 替换为您的真实上传接口
					filePath: filePath,
					name: 'file', // 后端接收字段名
					header: {
						'Authorization': uni.getStorageSync('accessToken') || ''
					},
					success: (uploadRes) => {
						try {
							// 注意：uni.uploadFile 的 success 返回的是字符串
							const resData = JSON.parse(uploadRes.data);
							if (resData.code === 200) {
								resolve(resData);
							} else {
								reject(new Error(resData.msg || '上传失败'));
							}
						} catch (parseError) {
							reject(new Error('响应解析失败'));
						}
					},
					fail: (err) => {
						reject(err);
					}
				});
			});
		},

		/**
		 * 提交商家图册信息
		 */
		async submitAlbumForm() {

			console.log('是否为更新' + this.isEditingAlbum)
			console.log('formAlbum', this.formAlbum)


			let formAlbumData = {}


			if (this.isEditingAlbum) {
				formAlbumData = {
					id: this.formAlbum.id,
					logoUrls: this.formAlbum.logoUrls,
					promoteUrls: this.formAlbum.promoteUrls,
					outsideUrls: this.formAlbum.outsideUrls,
					insideUrls: this.formAlbum.insideUrls,
					videoUrl: this.formAlbum.videoUrl,
				};
			} else {
				const companyInfo = uni.getStorageSync('companyInfo')
				formAlbumData = {
					merchantId: companyInfo.id,
					logoUrls: this.formAlbum.logoUrls,
					promoteUrls: this.formAlbum.promoteUrls,
					outsideUrls: this.formAlbum.outsideUrls,
					insideUrls: this.formAlbum.insideUrls,
					videoUrl: this.formAlbum.videoUrl,
				};
			}

			console.log('提交的', formAlbumData)


			const result = await request({
				url: `/merchantMedia`,
				method: this.isEditingAlbum ? 'PUT' : 'POST',
				data: formAlbumData,
				loading: true
			});

			if (result.code === 200) {
				uni.showToast({
					title: '已更新'
				});
				this.isEditingAlbum = true;

				await this.updateStorageCompanyInfo();
				this.fetchAlbumInfo(); // 重新获取数据
			} else {
				uni.showToast({
					title: result.msg || (isUpdate ? '更新失败' : '更新失败'),
					icon: 'none'
				});
			}

		},

		async fetchAlbumInfo() {
			try {
				const res = await request({
					url: `/merchantMedia/${this.merchantInfo.id}`,
					method: 'GET',
					loading: true
				});

				console.log('进入到了商家图册信息:', res);

				if (res.code == 200) {
					if (res.data == null) {
						this.isEditingAlbum = false
					} else {
						this.isEditingAlbum = true
					}
					const data = res.data || {};
					this.formAlbum.id = data.id || '';
					this.formAlbum.logoUrls = data.logoUrls || [];
					this.formAlbum.promoteUrls = data.promoteUrls || [];
					this.formAlbum.outsideUrls = data.outsideUrls || [];
					this.formAlbum.insideUrls = data.insideUrls || [];
					this.formAlbum.videoUrl = data.videoUrl || '';
					this.logo = data.logoUrls[0].url || data.logoUrls[1].url
				}


			} catch (err) {
				console.error('获取商家图册失败', err);
			}
		},

		navToOtherCertification() {
			uni.navigateTo({
				url: '/public/merchant/otherCertification'
			})
		},

		async getotherCertification() {
			try {
				const res = await request({
					url: `/merchantQualification/list/${this.merchantInfo.id}`,
					method: 'GET',
					loading: true
				});

				console.log('所有其他证书信息:', res);
				if (res.code == 200) {
					if (res.data) {
						this.otherCertificationList = res.data
					}
				}

			} catch (err) {
				console.error('获取所有其他证书信息失败', err);
				uni.showToast({
					title: '加载失败',
					icon: 'none'
				});
			}
		},

		// 确保 processImageForMiniProgram 方法存在且正确
		processImageForMiniProgram(imageUrl) {
			if (!imageUrl) return null;
			if (imageUrl.startsWith('http://') || imageUrl.startsWith('https://')) {
				return imageUrl;
			} else {
				return `${this.BASE_URL}${imageUrl}`;
			}
		},

		// 更新storage中的companyInfo
		async updateStorageCompanyInfo() {
			try {
				// 从服务器重新获取最新的商家信息
				const res = await request({
					url: '/merchant/query',
					method: 'GET',
					loading: false
				});

				if (res.code === 200 && res.data) {
					// 更新本地缓存的merchantInfo
					this.merchantInfo = res.data;

					// 更新storage中的companyInfo
					uni.setStorage({
						key: 'companyInfo',
						data: res.data,
						success: () => {
							console.log('companyInfo已更新到storage');
						},
						fail: (err) => {
							console.error('更新companyInfo到storage失败:', err);
						}
					});
				} else {
					console.error('获取最新商家信息失败:', res.msg);
				}
			} catch (error) {
				console.error('更新storage中的companyInfo失败:', error);
			}
		},

		// 图片上传回调
		async afterRead(event, group) {
			const file = event.file;
			try {
				// 显示上传中提示
				uni.showLoading({
					title: '上传中...',
					mask: true
				});

				// 发送上传请求->服务器
				const uploadResult = await this.uploadFileToServer(file);

				if (uploadResult.code === 200) {
					// 上传成功，更新对应的表单数据
					const targetForm =
						`form${group.charAt(0).toUpperCase() + group.slice(1)}`;

					// 直接使用服务器返回的URL，因为已经是完整的访问地址
					const fileUrl = uploadResult.data.url;
					// 处理小程序图片显示问题
					const processedUrl = this.processImageForMiniProgram(fileUrl);

					// // 设置图片数据，确保u-upload组件能正确显示
					const imageData = {
						url: processedUrl,
						thumb: processedUrl, // u-upload组件优先使用thumb属性
						name: uploadResult.data
							.originalName, // u-upload可能需要name字段
						size: uploadResult.data.size,
						objectName: uploadResult.data.objectName,
						originalName: uploadResult.data.originalName,
						status: 'success', // 标记上传成功
						isImage: true, // 标记为图片类型
						type: 'image' // 添加类型标识
					};

					// 使用普通对象而不是响应式对象
					this[targetForm].image = JSON.parse(JSON.stringify(imageData));

					// 上传成功后，保存图片URL到数据库
					if (group === 'authorization' || group === 'license') {
						await this.saveImageToDatabase(group, fileUrl);
					}
					// 注意：对于permit，image已经通过targetForm设置为对象了，不需要再单独设置
					// // 强制更新视图
					this.$forceUpdate();

					uni.showToast({
						title: '上传成功',
						icon: 'success'
					});
				} else {
					throw new Error(uploadResult.msg || '上传失败');
				}
			} catch (error) {
				console.error('文件上传失败:', error);
				uni.showToast({
					title: error.message || '上传失败',
					icon: 'none'
				});
			} finally {
				uni.hideLoading();
			}
		},
		// 图片删除回调
		onDeleteFile(event, group) {
			const targetForm =
				`form${group.charAt(0).toUpperCase() + group.slice(1)}`;
			this[targetForm].image = null;
		},

		// 获取文件访问URL - 针对本地文件存储优化
		getFileAccessUrl(objectName) {
			// 由于使用本地文件存储，直接使用下载接口URL，不再需要bucketName
			const downloadUrl =
				`${BASE_URL}/local-file/download?objectName=${objectName}`;
			return downloadUrl;
		},

		// 处理小程序图片显示问题 - 转换为可访问的URL
		processImageForMiniProgram(imageUrl) {
			if (!imageUrl) return null;

			// 确保URL是完整的HTTP/HTTPS地址
			if (imageUrl.startsWith('http://') || imageUrl.startsWith(
				'https://')) {
				return imageUrl;
			} else {
				// 如果是相对路径，补全BASE_URL
				return `${BASE_URL}${imageUrl}`;
			}
		},

		// 获取文件信息（小程序端使用）
		getFileInfo(filePath) {
			return new Promise((resolve, reject) => {
				uni.getFileInfo({
					filePath: filePath,
					success: (res) => {
						resolve({
							path: filePath,
							size: res.size,
							name: filePath.split('/')
								.pop()
						});
					},
					fail: (error) => {
						reject(error);
					}
				});
			});
		},

		// 转换现有的错误URL为正确的下载URL
		convertToValidUrl(originalUrl) {
			if (!originalUrl) return null;

			// 如果URL包含错误的域名前缀，需要转换
			if (originalUrl.includes('https://abc.qctrips.cn/storage/')) {
				// 提取文件路径信息
				const urlParts = originalUrl.replace(
					'https://abc.qctrips.cn/storage/', '').split('/');

				if (urlParts && urlParts.length >= 2) {
					const objectName = urlParts[1];
					return this.getFileAccessUrl(objectName);
				} else if (urlParts && urlParts.length === 1) {
					// 如果只有一个部分，可能直接是objectName
					const objectName = urlParts[0];
					return this.getFileAccessUrl(objectName);
				}
			}

			// 如果URL已经是正确格式，直接返回
			if (originalUrl.includes(`${BASE_URL}/local-file/download`)) {
				return originalUrl;
			}

			// 其他情况直接返回原URL
			return originalUrl;
		},

		// 上传文件到服务器
		uploadFileToServer(file) {
			return new Promise((resolve, reject) => {
				// 获取文件路径
				let filePath = '';
				if (file.path) {
					filePath = file.path;
				} else if (file.url) {
					filePath = file.url;
				} else {
					reject(new Error('无效的文件对象'));
					return;
				}

				// 使用uni.uploadFile进行文件上传 - 修正为本地文件服务端点

				uni.uploadFile({
					url: `${BASE_URL}/local-file/upload`,
					filePath: filePath,
					name: 'file',
					header: {
						'Authorization': uni.getStorageSync(
							'accessToken') || ''
					},
					success: (res) => {
						try {
							const data = JSON.parse(res.data);
							resolve(data);
						} catch (error) {
							console.error('解析上传响应失败:', error,
								res);
							reject(new Error('服务器响应格式错误'));
						}
					},
					fail: (error) => {
						console.error('上传请求失败:', error);
						reject(error);
					}
				});
			});
		},

		// 保存图片URL到数据库
		async saveImageToDatabase(group, fileUrl) {
			try {
				let updateData = {};
				let shouldSave = false;

				// 根据group类型确定要更新的字段
				if (group === 'license') {
					updateData.licenseUrl = fileUrl;
					shouldSave = true;
				} else if (group === 'authorization') {
					updateData.authPersonUrl = fileUrl;
					shouldSave = true;
				} else if (group === 'permit') {

				}

				// 只有营业执照和授权书需要保存到商户表
				if (shouldSave) {
					const result = await request({
						url: '/merchant/updateImages',
						method: 'PUT',
						data: updateData,
						loading: false // 不显示加载中，因为上传已经有提示了
					});

					if (result.code !== 200) {
						console.error('图片URL保存到数据库失败:', result.msg);
						uni.showToast({
							title: '图片保存失败',
							icon: 'none'
						});
					}
				}
			} catch (error) {
				console.error('保存图片URL到数据库失败:', error);
				uni.showToast({
					title: '图片保存失败',
					icon: 'none'
				});
			}
		},

		// 接口1：获取营业执照+授权书数据
		async fetchLicenseAuth() {
			try {
				if (this.merchantInfo) {
					const data = this.merchantInfo;
					console.log('本地获取商户信息:', data);
					// 营业执照数据映射
					const licenseUrl = this.convertToValidUrl(data
						.licenseUrl);

					// 处理小程序图片显示
					const processedLicenseUrl = this
						.processImageForMiniProgram(licenseUrl);

					this.formLicense.image = licenseUrl ? {
						url: processedLicenseUrl,
						thumb: processedLicenseUrl,
						name: 'license.jpg',
						status: 'success',
						isImage: true,
						type: 'image'
					} : null;

					this.formLicense.uscc = data.licenseNo || '';
					this.formLicense.companyName = data.name || '';
					this.formLicense.legalPerson = data.authPerson || '';

					// 授权书数据映射
					const authPersonUrl = this.convertToValidUrl(data
						.authPersonUrl);

					// 处理小程序图片显示
					const processedAuthUrl = this
						.processImageForMiniProgram(authPersonUrl);

					this.formAuthorization.image = authPersonUrl ? {
						url: processedAuthUrl,
						thumb: processedAuthUrl,
						status: 'success',
						isImage: true
					} : null;
					this.formAuthorization.authorizedPerson = data
						.authPerson || '';
					this.formAuthorization.idCard = data.idCard || '';
					this.formAuthorization.tel = data.phone || '';
					// 审核状态（使用数字状态码：0-待审核 1-审核通过 2-拒绝 3-待完善）
					const status = data.status || 0;
					this.formLicense.auditStatus = status;
					this.formAuthorization.companyName = data.name || '';
					this.formAuthorization.auditStatus = status;
				}
			} catch (err) {
				console.error('获取营业执照/授权书失败', err);
			}
		},
		// 接口2：获取商家基本信息
		async fetchBasicInfo() {
			console.log(555)
			try {
				const res = await request({
					url: `/merchant-item/getByMerchantId?merchantId=${this.merchantInfo.id}`,
					method: 'GET',
					loading: true
				});
				if (res.code === 200) {
					const data = res.data || {};
					console.log('进入到了商户信息:', data);
					this.formBasicInfo.id = data.id || '';
					this.formBasicInfo.city = data.city || '';
					this.formBasicInfo.shortName = data.shopName || '';
					this.formBasicInfo.branch = data.branchName || '';
					this.formBasicInfo.tel = data.phone ? data.phone.replace(/^(\d{3})\d{4}(\d{4})$/, '$1****$2') : '';
					this.formBasicInfo.complainTel = data
						.complaintPhone || '';
					this.formBasicInfo.address = data.address || '';
					// 审核状态（使用数字状态码：0-待审核 1-审核通过 2-拒绝 3-待完善）
					this.formBasicInfo.auditStatus = data.status;

					// 初始化初始状态标志 - 只在组件加载或重新获取数据时设置，不随用户输入变化
					if (!this.isEditingMerchantItem) {
						this.isInitialMerchantState = !this
							.formBasicInfo.shortName;
					}
				}
			} catch (err) {
				console.error('获取商家基本信息失败', err);
			}
		},
		// 接口3：获取经营许可证
		async fetchTravelPermit() {
			console.log('this.merchantInfo.id', this.merchantInfo
				.id)
			try {
				const res = await request({
					url: `/travel-agency/getByMerchantId?merchantId=${this.merchantInfo.id}`,
					method: 'GET',
					loading: true
				});
				console.log('经营许可证响应数据:', res.data);
				if (res.code === 200) {
					const data = res.data;
					// 保存ID用于后续更新操作
					this.formPermit.id = data.id || '';
					this.formPermit.agencyNo = data
						.travelAgencyId || '';
					this.formPermit.business = data.business || '';

					// 处理许可证图片URL（如果有的话）
					if (data.imageUrl) {
						const permitUrl = this.convertToValidUrl(
							data.imageUrl);
						// 处理小程序图片显示
						const processedPermitUrl = this
							.processImageForMiniProgram(permitUrl);
						this.formPermit.image = permitUrl ? {
							url: processedPermitUrl,
							thumb: processedPermitUrl,
							status: 'success',
							isImage: true
						} : null;
					}
					// 审核状态（使用数字状态码：0-待审核 1-审核通过 2-拒绝 3-待完善）
					const status = data.status || 0;
					this.formPermit.auditStatus = status;
				}
			} catch (err) {
				console.error('获取经营许可证失败', err);
			}
		},

		// 营业执照 - 进入编辑模式
		editLicense() {
			this.isEditingLicense = true;
			this.isAddingLicense = false;
		},

		// 营业执照 - 新增
		createLicense() {
			this.isEditingLicense = true;
			this.isAddingLicense = true;
		},

		// 营业执照 - 保存编辑
		async saveLicense() {
			console.log('保存营业执照数据:', this.formLicense);
			uni.showModal({
				title: '保存确认',
				content: '确定要保存营业执照信息吗？',
				success: async (res) => {
					if (res.confirm) {
						try {
							// 构建营业执照数据
							const licenseData = {
								licenseNo: this
									.formLicense
									.uscc,
								name: this
									.formLicense
									.companyName,
								authPerson: this
									.formLicense
									.legalPerson,
								licenseUrl: this
									.formLicense
									.image ? (
									this
										.formLicense
										.image
										.url ||
									this
										.formLicense
										.image
								) : ''
							};
							const result =
								await request({
									url: '/merchant/update',
									method: 'PUT',
									data: licenseData,
									loading: true
								});

							if (result.code ===
								200) {
								uni.showToast({
									title: this
										.isAddingLicense ?
										'新增成功' : '保存成功',
									icon: 'success'
								});
								this.isEditingLicense =
									false;
								this.isAddingLicense =
									false;

								// 更新storage中的companyInfo
								await this
									.updateStorageCompanyInfo();

								// 获取营业执照+授权书
								this
									.fetchLicenseAuth();
							} else {
								uni.showToast({
									title: result
										.msg ||
										(this
											.isAddingLicense ?
											'新增失败' :
											'保存失败'
										),
									icon: 'none'
								});
							}
						} catch (err) {
							console.error(
								'保存营业执照失败', err
							);
							uni.showToast({
								title: '保存失败',
								icon: 'none'
							});
						}
					}
				}
			});
		},

		// 营业执照 - 取消编辑
		cancelEditLicense() {
			this.isEditingLicense = false;
			this.isAddingLicense = false;
			// 如果是新增状态取消，清空输入
			if (this.isAddingLicense) {
				this.formLicense.uscc = '';
				this.formLicense.companyName = '';
				this.formLicense.legalPerson = '';
				this.formLicense.image = null;
			}
			// 重新加载数据
			this.fetchLicenseAuth();
		},

		// 营业执照 - 删除
		async deleteLicense() {
			uni.showModal({
				title: '删除确认',
				content: '确定要删除营业执照信息吗？删除后将清空所有营业执照相关数据。',
				success: async (res) => {
					if (res.confirm) {
						try {
							const
								licenseData = {
									licenseNo: '',
									name: '',
									authPerson: '',
									licenseUrl: ''
								};

							const result =
								await request({
									url: '/merchant/update',
									method: 'PUT',
									data: licenseData,
									loading: true
								});

							if (result.code ===
								200) {
								uni.showToast({
									title: '删除成功',
									icon: 'success'
								});
								// 清空表单数据
								this.formLicense
									.uscc = '';
								this.formLicense
									.companyName =
									'';
								this.formLicense
									.legalPerson =
									'';
								this.formLicense
									.image =
									null;

								// 更新storage中的companyInfo
								await this
									.updateStorageCompanyInfo();

								// 重新获取数据
								this
									.fetchLicenseAuth();
							} else {
								uni.showToast({
									title: result
										.msg ||
										'删除失败',
									icon: 'none'
								});
							}
						} catch (err) {
							console.error(
								'删除营业执照失败',
								err);
							uni.showToast({
								title: '删除失败',
								icon: 'none'
							});
						}
					}
				}
			});
		},

		// ========== 授权书相关方法 ==========
		// 授权书 - 进入编辑模式
		editAuthorization() {
			this.isEditingAuthorization = true;
			this.isAddingAuthorization = false;
		},

		// 授权书 - 新增
		createAuthorization() {
			this.isEditingAuthorization = true;
			this.isAddingAuthorization = true;
		},

		// 管理员授权书 - 保存编辑
		async saveAuthorization() {
			console.log('保存授权书数据:', this
				.formAuthorization);
			uni.showModal({
				title: '保存确认',
				content: '确定要保存授权书信息吗？',
				success: async (res) => {
					if (res.confirm) {
						try {
							// 构建授权书数据
							const
								authorizationData = {
									name: this
										.formAuthorization
										.companyName, // 授权单位名称
									authPerson: this
										.formAuthorization
										.authorizedPerson, // 被授权人
									authPersonUrl: this
										.formAuthorization
										.image ?
										(this
											.formAuthorization
											.image
											.url ||
											this
												.formAuthorization
												.image
										) : '',
									idCard: this
										.formAuthorization
										.idCard,
									phone: this
										.formAuthorization
										.tel
								};
							const result =
								await request({
									url: '/merchant/update',
									method: 'PUT',
									data: authorizationData,
									loading: true
								});

							if (result
								.code ===
								200) {
								uni.showToast({
									title: this
										.isAddingAuthorization ?
										'新增成功' : '保存成功',
									icon: 'success'
								});
								this.isEditingAuthorization =
									false;
								this.isAddingAuthorization =
									false;

								// 更新storage中的companyInfo
								await this
									.updateStorageCompanyInfo();

								// 重新获取数据
								this
									.fetchLicenseAuth();
							} else {
								uni.showToast({
									title: result
										.msg ||
										(this
											.isAddingAuthorization ?
											'新增失败' :
											'保存失败'
										),
									icon: 'none'
								});
							}
						} catch (err) {
							console.error(
								'保存授权书失败',
								err);
							uni.showToast({
								title: '保存失败',
								icon: 'none'
							});
						}
					}
				}
			});
		},

		// 授权书 - 取消编辑
		cancelEditAuthorization() {
			this.isEditingAuthorization = false;
			this.isAddingAuthorization = false;
			// 如果是新增状态取消，清空输入
			if (this.isAddingAuthorization) {
				this.formAuthorization.companyName =
					'';
				this.formAuthorization
					.authorizedPerson = '';
				this.formAuthorization.idCard = '';
				this.formAuthorization.tel = '';
				this.formAuthorization.image = null;
			}
			// 重新加载数据
			this.fetchLicenseAuth();
		},

		// 授权书 - 删除
		async deleteAuthorization() {
			uni.showModal({
				title: '删除确认',
				content: '确定要删除授权书信息吗？删除后将清空所有授权书相关数据。',
				success: async (res) => {
					if (res.confirm) {
						try {
							const
								authorizationData = {
									authPerson: '',
									authPersonUrl: '',
									idCard: '',
									tel: ''
								};

							const
								result =
									await request({
										url: '/merchant/updateAuth',
										method: 'PUT',
										data: authorizationData,
										loading: true
									});

							if (result
								.code ===
								200) {
								uni.showToast({
									title: '删除成功',
									icon: 'success'
								});
								// 清空表单数据
								this.formAuthorization
									.companyName =
									'';
								this.formAuthorization
									.authorizedPerson =
									'';
								this.formAuthorization
									.idCard =
									'';
								this.formAuthorization
									.tel =
									'';
								this.formAuthorization
									.image =
									null;

								// 更新storage中的companyInfo
								await this
									.updateStorageCompanyInfo();

								// 重新获取数据
								this
									.fetchLicenseAuth();
							} else {
								uni.showToast({
									title: result
										.msg ||
										'删除失败',
									icon: 'none'
								});
							}
						} catch (err) {
							console
								.error(
									'删除授权书失败',
									err
								);
							uni.showToast({
								title: '删除失败',
								icon: 'none'
							});
						}
					}
				}
			});
		},

		// ========== 旅行社许可证相关方法 ==========
		// 旅行社许可证 - 进入编辑模式
		editTravelAgency() {
			this.isEditingTravelAgency = true;
		},

		// 旅行社许可证 - 新增
		createTravelAgency() {
			this.isAdd = true;
			this.isEditingTravelAgency = true;
		},

		// 旅行社许可证 - 保存编辑
		async saveTravelAgency() {
			uni.showModal({
				title: '保存确认',
				content: '确定要保存旅行社许可证信息吗？',
				success: async (
					res) => {
					if (res
						.confirm) {
						try {
							// 提取图片URL字符串
							let imageUrlString =
								'';
							if (this
								.formPermit
								.image
							) {
								if (typeof this
									.formPermit
									.image ===
									'string'
								) {
									imageUrlString
										=
										this
											.formPermit
											.image;
								} else if (
									this
										.formPermit
										.image
										.url
								) {
									imageUrlString
										=
										this
											.formPermit
											.image
											.url;
								}
							}

							// 构建旅行社许可证数据
							const
								travelAgencyData = {
									id: this
										.formPermit
										.id,
									merchantId: this
										.merchantInfo
										.id,
									travelAgencyId: this
										.formPermit
										.agencyNo,
									imageUrl: imageUrlString,
									business: (
										this
											.formPermit
											.scope ||
										''
									)
										.split(
											'\n'
										)
										.filter(
											item =>
												item
													.trim()
										)
										.map(
											item =>
											({
												businessItem: item
													.trim()
											})
										)
								};
							console
								.log(
									'travelAgencyData',
									travelAgencyData
								);
							//编辑还是新增
							const
								add =
									this
										.isAdd
							console
								.log(
									'add',
									add
								)

							const
								result =
									await request({
										url: '/travel-agency',
										method: add ?
											'POST' : 'PUT',
										data: travelAgencyData,
										loading: true
									});
							console
								.log(
									'result',
									result
								);
							if (result
								.code ===
								200
							) {
								uni.showToast({
									title: add ?
										'新增成功' : '编辑成功'
								});
								this.isEditingTravelAgency =
									false;
								if (
									add) {
									this.formPermit
										.id =
										result
											.data;
								}
								this
									.fetchTravelPermit(); // 重新获取数据
							} else {
								uni.showToast({
									title: result
										.msg ||
										(add ?
											'新增失败' :
											'编辑失败'
										),
									icon: 'none'
								});
							}
						} catch (
						err) {
							console
								.error(
									'保存旅行社许可证失败',
									err
								);
							uni.showToast({
								title: '保存失败',
								icon: 'none'
							});
						}
					}
				}
			});
		},

		// 旅行社许可证 - 取消编辑
		cancelEditTravelAgency() {
			this.isEditingTravelAgency = false;
			// 如果是新增状态取消，清空输入
			if (!this.formPermit.agencyNo) {
				this.formPermit.agencyNo = '';
				this.formPermit.scope = '';
			}
		},

		// 旅行社许可证 - 删除
		async deleteTravelAgency() {
			uni.showModal({
				title: '删除确认',
				content: '确定要删除旅行社许可证吗？',
				success: async (
					res) => {
					if (res
						.confirm
					) {
						try {
							const
								result =
									await request({
										url: '/travel-agency/delete',
										method: 'DELETE',
										data: this
											.formPermit
											.id,
										loading: true
									});

							if (result
								.code ===
								200
							) {
								uni.showToast({
									title: '删除成功',
									icon: 'success'
								});
								this
									.formPermit = {};
								this
									.fetchTravelPermit(); // 重新获取数据
							} else {
								uni.showToast({
									title: result
										.msg ||
										'删除失败',
									icon: 'none'
								});
							}
						} catch (
						err
						) {
							console
								.error(
									'删除旅行社许可证失败',
									err
								);
							uni.showToast({
								title: '删除失败',
								icon: 'none'
							});
						}
					}
				}
			});
		},

		// 商家基本信息 - 进入编辑模式
		editMerchantItem() {
			this.isEditingMerchantItem =
				true;
		},

		// 商家基本信息 - 新增模式
		createMerchantItem() {
			this.isEditingMerchantItem =
				true;
		},

		// 商家基本信息 - 保存编辑
		async saveMerchantItem() {
			uni.showModal({
				title: '保存确认',
				content: '确定要保存商家基本信息吗？',
				success: async (
					res
				) => {
					if (res
						.confirm
					) {
						try {
							// 根据是否有数据判断是新增还是更新
							const
								isUpdate = !
									!
									this
										.formBasicInfo
										.id;
							console
								.log(
									'是否为更新' +
									isUpdate
								)
							console
								.log(
									'merchantInfo',
									this
										.merchantInfo
								)

							// 构建商家信息数据
							let merchantItemData = {}

							if (
								isUpdate) {
								merchantItemData
									= {
									id: this
										.formBasicInfo
										.id,
									city: this
										.formBasicInfo
										.city,
									shopName: this
										.formBasicInfo
										.shortName,
									branchName: this
										.formBasicInfo
										.branch,
									phone: this
										.formBasicInfo
										.tel,
									complaintPhone: this
										.formBasicInfo
										.complainTel,
									address: this
										.formBasicInfo
										.address,
									latitude: this
										.formBasicInfo
										.latitude,
									longitude: this
										.formBasicInfo
										.longitude
								};
							} else {
								const
									companyInfo =
										uni
											.getStorageSync(
												'companyInfo'
											)
								merchantItemData
									= {
									merchantId: companyInfo
										.id,
									city: this
										.formBasicInfo
										.city,
									shopName: this
										.formBasicInfo
										.shortName,
									branchName: this
										.formBasicInfo
										.branch,
									phone: this
										.formBasicInfo
										.tel,
									complaintPhone: this
										.formBasicInfo
										.complainTel,
									address: this
										.formBasicInfo
										.address,
									latitude: this
										.formBasicInfo
										.latitude,
									longitude: this
										.formBasicInfo
										.longitude
								};
							}

							console
								.log(
									merchantItemData
								)

							const
								result =
									await request({
										url: isUpdate ?
											'/merchant-item' : '/merchant-item/post',
										method: isUpdate ?
											'PUT' : 'POST',
										data: merchantItemData,
										loading: true
									});

							if (result
								.code ===
								200
							) {
								uni.showToast({
									title: isUpdate ?
										'编辑成功' : '新增成功'
								});
								this.isEditingMerchantItem =
									false;
								// 保存成功后，不再是初始状态
								this.isInitialMerchantState =
									false;
								await this
									.updateStorageCompanyInfo();
								this
									.fetchBasicInfo(); // 重新获取数据
							} else {
								uni.showToast({
									title: result
										.msg ||
										(isUpdate ?
											'编辑失败' :
											'新增失败'
										),
									icon: 'none'
								});
							}
						} catch (
						err
						) {
							console
								.error(
									'保存商家信息失败',
									err
								);
							uni.showToast({
								title: '保存失败',
								icon: 'none'
							});
						}
					}
				}
			});
		},

		// 商家基本信息 - 取消编辑
		cancelEditMerchantItem() {
			this.isEditingMerchantItem =
				false;
			// 如果是初始状态取消，清空输入
			if (this
				.isInitialMerchantState
			) {
				this.formBasicInfo.id =
					'';
				this.formBasicInfo
					.city = '';
				this.formBasicInfo
					.shortName = '';
				this.formBasicInfo
					.branch = '';
				this.formBasicInfo
					.tel = '';
				this.formBasicInfo
					.complainTel = '';
				this.formBasicInfo
					.address = '';
			}
		},

		// 商家基本信息 - 删除
		async deleteMerchantItem() {
			uni.showModal({
				title: '删除确认',
				content: '确定要删除商家基本信息吗？',
				success: async (
					res
				) => {
					if (res
						.confirm
					) {
						try {
							const
								result =
									await request({
										url: '/merchant-item/delete',
										method: 'DELETE',
										data: this
											.formBasicInfo
											.id,
										loading: true
									});

							if (result
								.code ===
								200
							) {
								uni.showToast({
									title: '删除成功'
								});
								this
									.fetchBasicInfo(); // 重新获取数据
							} else {
								uni.showToast({
									title: result
										.msg ||
										'删除失败',
									icon: 'none'
								});
							}
						} catch (
						err
						) {
							console
								.error(
									'删除商家信息失败',
									err
								);
							uni.showToast({
								title: '删除失败',
								icon: 'none'
							});
						}
					}
				}
			});
		},
	},
};
</script>

<style lang="scss" scoped>
/* 样式与之前一致，确保布局、颜色匹配设计 */
.app-container {
	width: 100%;
	min-height: 100vh;
	background: #f8f8f8;
	position: relative;
}

.info-body {
	// background: #fff;
	margin: 20rpx;
}

.page-wrap {
	padding-bottom: 120rpx;
	height: calc(100vh - 120rpx);
}

/* 顶部机构信息卡片 */
.merchant-header {
	display: flex;
	align-items: center;
	padding: 20rpx;
	margin: 20rpx;
	background: #ffffff;
	border-radius: 16rpx;
}

.merchant-logo {
	width: 120rpx;
	height: 120rpx;
	background: #f0f0f0;
	border-radius: 12rpx;
	overflow: hidden;
	margin-right: 24rpx;
}

.merchant-logo image {
	width: 100%;
	height: 100%;
}

.merchant-info {
	flex: 1;
}

.merchant-name {
	font-size: 30rpx;
	color: #333;
	margin-bottom: 4rpx;
	display: flex;
	gap: 10rpx;
	align-items: flex-end;
}

.merchant-company {
	font-size: 24rpx;
	color: #999;
	margin-bottom: 4rpx;
}

.merchant-contact {
	font-size: 24rpx;
}

.merchant-tag {
	margin-left: 16rpx;
}

/* 卡片样式 */
.card {
	background: #ffffff;
	margin-bottom: 10rpx;
	position: relative;
}

.collapse-item {
	overflow: hidden;
	background: #fff;
	margin-bottom: 20rpx;
}

.collapse-card {
	background: #ffffff;
}

/* 折叠标题卡片样式 - 去掉底色和边框，与折叠按钮合成一个块 */
.collapse-title-card {
	background: transparent !important;
	box-shadow: none !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* 折叠面板标题样式 */
.section-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-right: 10rpx;
}

.section-left {
	display: flex;
	align-items: center;
	gap: 12rpx;
}

.section-title {
	font-size: 30rpx;
	font-weight: bold;
	color: #333;
}

.status-tag {
	border-radius: 16rpx;
	font-weight: 500;
}

/* 表单行样式 */
.form-row {
	display: flex;
	align-items: center;
	margin-bottom: 22rpx;
	padding: 12rpx 0;
	border-bottom: 2rpx solid #f0f0f0;
}

.form-row:last-child {
	border-bottom: none;
	margin-bottom: 0;
}

.label-section {
	width: 200rpx;
	min-width: 200rpx;
}

.label {
	width: 140rpx;
	text-align: justify;
	font-size: 28rpx;
	color: #666;
	font-weight: 500;
}

.input-section {
	flex: 1;
}

.value {
	font-size: 28rpx;
	color: #333;
	word-break: break-all;
}

.custom-upload {
	margin-bottom: 20rpx;
}

.image-display {
	// margin-bottom: 20rpx;
	position: relative;
}

.permit-image {
	width: 200rpx;
	height: 200rpx;
	border-radius: 8rpx;
	// border: 2rpx solid #eee;
}

/* 操作按钮样式 */
.action-buttons {
	display: flex;
	justify-content: flex-end;
	gap: 16rpx;
	padding: 20rpx 20rpx 0 20rpx;
}

.action-buttons-add {
	padding: 20rpx 30rpx;
	font-size: 28rpx;
	color: #F37B1D;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 10rpx;
	border: 1px #F37B1D solid;
}

.action-buttons-update {
	padding: 20rpx 30rpx;
	color: #666;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 10rpx;
	border: 1px #ccc solid;
}

.action-buttons-submit {
	padding: 20rpx 30rpx;
	font-size: 28rpx;
	color: #F37B1D;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 10rpx;
	border: 1px #F37B1D solid;
}

.action-buttons button {
	height: 72rpx;
	line-height: 72rpx;
	font-size: 26rpx;
	padding: 0 24rpx;
}

/* 响应式适配 */
@media (max-width: 750rpx) {
	.label-section {
		width: 160rpx;
		min-width: 160rpx;
	}

	.label {
		font-size: 26rpx;
	}

	.card {
		padding: 24rpx;
		margin-bottom: 24rpx;
	}

	.page-wrap {
		padding: 16rpx;
		padding-top: 100rpx;
	}

	.merchant-header {
		padding: 24rpx 20rpx;
	}

	.merchant-logo {
		width: 100rpx;
		height: 100rpx;
		margin-right: 20rpx;
	}

	.merchant-name {
		font-size: 30rpx;
	}

	.merchant-company {
		font-size: 24rpx;
	}

	.merchant-contact {
		font-size: 22rpx;
	}
}

/* 表单项 */

.form-container {
	display: flex;
	flex-direction: column;
	gap: 20rpx;
}

.form-item {
	display: flex;
	align-items: center;
	gap: 10rpx;

}

.form-inp {
	flex: 1;
	color: #333;
	padding: 10rpx;
	font-weight: bold;

}

.form-inp2 {
	padding: 14rpx;
	border-radius: 4rpx;
	margin-top: 10rpx;
	font-weight: bold;

	&.none {
		background: none;
		border: none;
		padding: 0;
	}
}

.label {
	// width: 160rpx;
	// font-size: 28rpx;
	// color: #999;
}

.info-update {
	color: #ff6700;
	border: 2rpx solid #ff6700;
	padding: 12rpx 24rpx;
	font-size: 26rpx;
	border-radius: 16rpx;
	position: absolute;
	top: 0;
	right: 0;
}

::v-deep {
	.u-upload__wrap {
		justify-content: center !important;

		image,
		.u-upload__button {
			width: 200rpx !important;
			height: 200rpx !important;
		}

		.u-upload__success {
			display: none !important;
		}

		.u-upload__wrap__preview {
			border: 2rpx solid #eee !important;
		}
	}
}

/* 无图片占位符样式 */
.no-image-placeholder {
	width: 200rpx;
	height: 200rpx;
	border: 2rpx dashed #ddd;
	border-radius: 8rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #999;
	font-size: 24rpx;
	background: #f9f9f9;
}

.image-list {
	display: flex;
	gap: 10px;
	/* 图片间距 */
	flex-wrap: wrap;
}

.logo-image {
	width: 200rpx;
	height: 200rpx;
}

.upload-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.upload-title {
	font-size: 30rpx;
	color: #333333;
	font-weight: bold;
	margin-bottom: 15rpx;
}

.upload-p {
	font-size: 28rpx;
	color: #F37B1D;

	margin-bottom: 15rpx;
}

.upload-desc {
	color: #a0a0a0;
	font-size: 24rpx;
	margin-bottom: 15rpx;
}

.upload-section {
	margin-bottom: 30rpx;
}

.upload-section ::v-deep .u-upload__wrap {
	justify-content: flex-start !important;
}

.no-image {
	border-radius: 5px;
	margin-bottom: 5px;
}

.other-certification-btn {
	padding: 10px;
	// display: inline-flex;
	display: flex;
	align-items: center;
	gap: 10px;
	background-color: #fff;
	border-radius: 20rpx;
}

.other-certification-btn-icon {
	width: 30px;
	height: 30px;
}

.other-certification-btn-text {
	color: #3fbda3;
}

.certification-img-box {
	display: flex;
	align-items: center;
}

.certification-img {
	width: 200px;
	height: 120px;
	border-radius: 10px;

}

.form-line {
	display: flex;
	gap: 10px;
}

.wd-image-list {
	display: flex;
	align-content: center;
	flex-wrap: wrap;
	gap: 15rpx;
}

.image-item {
	position: relative;
	width: 150rpx;
	height: 150rpx;
	border-radius: 20rpx;
	overflow: hidden;
}

.wd-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.delete-button {
	position: absolute;
	top: 0rpx;
	right: 0rpx;
	background-color: rgba(255, 255, 255, 0.8);
	border-radius: 50%;
	padding: 4rpx;
	display: flex;
	justify-content: center;
	align-items: center;
}

.add-wd-image,
.no-wd-image {
	width: 150rpx;
	height: 150rpx;
	border-radius: 20rpx;
	border: 2px #888 dashed;
	margin-bottom: 5px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}

.no-wds-image {
	width: 114px;
	height: 114px;
	background-color: #f4f5f7;
	border-radius: 2px;
	margin: 0 8px 8px 0;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.form-inp ::v-deep .u-textarea {
	padding: 0 !important;
}

/* 模拟 placeholder 的文本样式 */
.placeholder-text {
	color: #a0a0a0 !important;
	font-weight: normal;
	font-size: 26rpx;
}
</style>